<template>
  <!-- 输入框 start -->
  <view class="uni-form-item uni-column">
    <input
      class="uni-input"
      confirm-type="search"
      placeholder="键盘右下角按钮显示为搜索"
    />
  </view>
  <!-- 输入框 end -->
  <!-- 轮播图 start -->
  <swiper class="swiper" circular :indicator-dots="true" :autoplay="true">
    <swiper-item v-for="item in SwiperArr" :key="item.bannerid">
      <image class="swiper-item" :src="item.img" mode="aspectFill" />
    </swiper-item>
  </swiper>
  <!-- 轮播图 end -->
</template>

<script setup>
import { ref } from "vue";

let SwiperArr = ref([]);

function loadSwiper() {
  uni.request({
    url: "http://47.94.6.186:3001/api/banner/list",
    method: "GET",
    success(res) {
      console.log(res);
      SwiperArr.value = res.data.data;
    },
    fail: (err) => {
      console.log(err);
    },
  });
}
loadSwiper();
</script>

<style scoped>
:deep(.uni-form-item) {
  border: 1px solid;
}

.swiper {
  height: 300rpx;
}

.swiper-item {
  width: 100%;
  height: 100%;
}
</style>
